<template>
  <div class="home-header">
    <div>
      <i class="iconfont icon-Beats" @click="ToHomeClick()"></i>
    </div>
    <div class="go-search" @click="goSearch">
      <i class="iconfont icon-fangdajing"></i>
      <span>搜索商品名称</span>
    </div>
    <div>
      <i class="iconfont icon-wode" @click="goProfile"></i>
    </div>
  </div>
</template>

<script>
export default {
  name: "Header",
  methods: {
    ToHomeClick() {
      this.$emit('ToHome')
    },
    goSearch(){
      this.$router.replace('/search')
    },
    goProfile(){
      this.$router.replace('/profile')
    }
  }
}
</script>

<style scoped lang="scss">
.home-header{
  display: flex;
  justify-content: space-around;
  line-height: 30px;
  background-color: #F4F4F4;
  .go-search{
    width: 9rem;
    text-align: center;
    border-radius: 30px;
    background-color: white;
    span{
      font-size: 16px;
      color: #89898b;
    }
  }
}

</style>